<?php
$baseUrl = Yii::app()->baseUrl;
$cs      = Yii::app()->getClientScript();

$cs->registerCssFile($baseUrl 
    . '/js/ext/plupload/style.css'
);

$jsFileList = array(
    'browserplus-min',
    'plupload',
    'plupload.html5',
);
foreach ($jsFileList as $file) {
    $path = $baseUrl . '/js/ext/plupload/' . $file . '.js';
    $cs->registerScriptFile($path, 1);
}
?>

<div id="page-layout"><div id="page-content">
  <div class="no-bg-image wrapper-full" id="page-content-wrapper">
    <div class="content-box">
        <div id="pluploadContainer" class="pluploadContainer"
             style="display: block; height: 250px; border: 1px solid blue;overflow-y:scroll;">
            <div id="uploadedImage" class="pluploadImage"></div>
            <div id="filelist"></div>
        </div>
        
        <a id="pickfiles" href="#">[Select files]</a>
	    <a id="uploadfiles" href="#">[Upload files]</a>
    </div>
  </div>
  <div class="clear"></div>
</div></div>

<div id="null" style="display:none;"></div>

<script type="text/javascript">
$(function() {
    var uploader = new plupload.Uploader({
        runtimes : 'html5',
        browse_button : 'pickfiles',
//        container : 'pluploadContainer',
        drop_element: 'pluploadContainer',
        max_file_size : '10mb',
        url : '<?php echo $this->createUrl('upload'); ?>',
        // Specify what files to browse for
        filters : [
            {title : "Image files", extensions : "jpg,gif,png"},
            {title : "Document files", extensions : "pdf,doc,excel"},
            {title : "Zip files", extensions : "zip,rar"}
        ],
        file_data_name: 'file_upload'
    });

    uploader.bind('Init', function(up, params) {});

    uploader.init();

    uploader.bind('FilesAdded', function(up, files) {
        $.each(files, function(i, file) {
            $('#filelist').append(
                '<div id="' + file.id + '">' +
                file.name + ' (' + plupload.formatSize(file.size) + ') <b></b>' +
                ' (<span id="cancel' + file.id + '" style="cursor:pointer;">cancel</span>)' +
            '</div>');
        
            //Bind cancel click event
            $('#cancel'+file.id).click(function(){
                $('#' + file.id).remove();
                uploader.removeFile(file);
                $(this).unbind().remove();
            });
        });
        
        up.refresh(); // Reposition Flash/Silverlight
        
    });

    uploader.bind('UploadProgress', function(up, file) {
        $('#' + file.id + " b").html(file.percent + "%");
    });

    uploader.bind('Error', function(up, err) {
        $('#filelist').append("<div>Error: " + err.code +
            ", Message: " + err.message +
            (err.file ? ", File: " + err.file.name : "") +
            "</div>"
        );

        up.refresh(); // Reposition Flash/Silverlight
    });

    uploader.bind('FileUploaded', function(up, file) {
        $('#' + file.id + " b").html("100%");
    });
    
    uploader.bind('UploadComplete', function(up, files) {
        $('#filelist').empty();
        showFiles();
    });
    
    function showFiles() {
        var url = '<?php echo $this->createUrl('showFiles') ?>';
        $('#uploadedImage').empty().load(url);
    }
    
    //Initialize
    showFiles();
    
    //Events
    $('#uploadfiles').click(function(e) {
        if ($('#filelist').text().length !== 0) {
            uploader.start();
            e.preventDefault();
        }
    });
    
    
    $('.pluploadImage').on('click', '.deleteFile', function(){
        var answer;
        var url = '<?php echo $this->createUrl('comImgMan/deleteFile'); ?>';
        
        answer = confirm('Are you sure?');
        if (answer) {
            $.post(url, {name: $(this).attr('ref')}, function(data){
                if (data == 'success') {
                    showFiles();
                }
            })
        }
    })
    
    function getUrlParam(paramName) {
        var reParam = new RegExp('(?:[\?&]|&amp;)' + paramName + '=([^&]+)', 'i') ;
        var match = window.location.search.match(reParam) ;

        return (match && match.length > 1) ? match[1] : '' ;
    }

    $('.pluploadImage').on('click', '.insertFile', function(){
//        var funcNum = getUrlParam('CKEditorFuncNum');
        var funcNum = '<?php if (isset($_GET['CKEditorFuncNum'])) echo $_GET['CKEditorFuncNum']; ?>';
        var fileUrl = $(this).attr('ref');
        var message = '';
        
        window.opener.CKEDITOR.tools.callFunction(funcNum, fileUrl, message);
        window.close();
    })
});
</script>